<!DOCTYPE html>
<html lang="en">
<head>

[#include "/customer/include/static.htm"]
    <link href="${path}/resources/css/register.css?v=1.0" rel="stylesheet" type="text/css">

    <link href="${path}/resources/plug/layui/css/layui.css" rel="stylesheet" type="text/css"/>
    <script src="${path}/resources/plug/layui/layui.js" type="text/javascript"></script>
</head>
[#include "/customer/include/header.ftl"]
<div class="reg" style="margin-top: 20px">

    <h3 class="reg_tt1">
    </h3>
    <div id="regbmg">
        <form class="layui-form">
            <div class="layui-form-item" style="margin-top: 50px">
                <label class="layui-form-label">手机</label>
                <div class="layui-input-inline">
                    <input placeholder="请输入手机号码" type="text" id="mobile" name="mobile" class="layui-input" lay-verify="required" onkeyup="value=value.replace(/[^\d.]/g,'')">
                </div>
            </div>

            [#--<div class="layui-form-item" >--]
                [#--<label class="layui-form-label">用户名</label>--]
                [#--<div class="layui-input-inline">--]
                    [#--<input  style="background-position: 0 -630px;" id="username" name="username"--]
                           [#--lay-verify="required" type="text" placeholder="请输入用户名" class="layui-input">--]
                [#--</div>--]
            [#--</div>--]
            <div class="layui-form-item" >
                <label class="layui-form-label">密码</label>
                <div class="layui-input-inline">
                    <input   lay-verify="required"
                             style="background-position: 0 -415px;" type="password" id="pass1" name="pass1"
                             placeholder="请输入6-12位英文+数字密码" class="layui-input">
                </div>
            </div>

            <div class="layui-form-item" >
                <label class="layui-form-label">确认密码</label>
                <div class="layui-input-inline">
                    <input   lay-verify="required"
                             style="background-position: 0 -415px;" type="password" id="pass2" name="pass2"
                             placeholder="请输入重复密码" class="layui-input">
                </div>
            </div>
			<div class="layui-form-item">
				<label class="layui-form-label">推荐好友手机号</label>
				<div class="layui-input-inline">
					<input style="background-position: 0 -415px;" type="text" id="inviter" name="inviter"
							 placeholder="推荐好友手机号(选填)" class="layui-input" [#if mobilePhone?? ]readonly[/#if] value="${mobilePhone}">
				</div>
			</div>

            <div class="layui-form-item" >
                <label class="layui-form-label">图形验证码</label>
                <div class="layui-input-inline">
                    <input   type="text" name="captcha" lay-verify="required"
                             id="captcha" maxlength="4"
                             style="width: 170px;background-position: 0 -630px;" placeholder="请输入图形验证码" class="layui-input">

                </div>
                <div class="layui-input-inline">
                    <img src="${path}/common/random" id="code_img"  style="position: relative;" width="89" height="27"
                         onclick="this.src = '${path}/common/random?' + Math.random();"
                         title="点击刷新验证码"/>

                </div>
            </div>

            <div class="layui-form-item">
                <button lay-submit lay-filter="MainForm" class="layui-btn" style="background-color: #ff5e69;margin-left:120px;width: 280px;margin-top:3px;">立刻注册</button>
            </div>

        </form>

    </div>
</div>

<script>
    layui.use(['form','layer'], function(){
        var form = layui.form(), $=layui.jquery, layer = layui.layer;
        form.on('submit(MainForm)', function(data){

            var pass1 = $("#pass1").val();
            var pass2 = $("#pass2").val();
            if (pass1 == "" || pass1.length < 6) {
                layer.msg("密码长度不正确");
                return;
            }
            if (pass1 != pass2) {
                layer.msg("两次密码输入不一致！");
                return;
            }

            var index = layer.load();
            ajax({
                url:"${path}/regist_step1",
                data: data.field,
                type:"POST",
                dataType:"json",
                success: function(result){


                    if(result.type == "success"){
                        layer.msg(result.content,function() {
                            window.location.href = "${path}/member/";
                        });

                    }else{
                        layer.msg(result.content);
                    }
                    layer.close(index);
                },
                complete:function(){
                    layer.close(index);
                }
            });
            return false;
        });
    });

</script>
[#include "/customer/include/footer.ftl"]

    </body>
</html>